$(function() {
	showPlaceHolder('sql-input', 'Input SQL Here...', 'placeholder-max');
	showPlaceHolder('param-input', 'Input param Here...', 'placeholder-max');

	$('[id$=input] textarea').focus(function() {
		if ($(this).attr('class').startsWith('placeholder')) {
			$(this).val('');
			$(this).removeClass();
		}
	});

	$('#sql-input textarea').blur(
			function() {
				if ($(this).val() == '') {
					showPlaceHolder('sql-input', 'Input SQL Here...',
							'placeholder-max');
				} else {
					$(this).removeClass();
				}
			});
	$('#param-input textarea').blur(
			function() {
				if ($(this).val() == '') {
					showPlaceHolder('param-input', 'Input param Here...',
							'placeholder-max');
				} else {
					$(this).removeClass();
				}
			});
	
	$('#switch').click(function(){
		if($(this).is(':checked')){
			$('#format-btn button span').text('REPLACE AND FORMAT');
		}else{
			$('#format-btn button span').text('REPLACE');
		}
	});

	$('#format-btn button').click(function() {
						$('#tip span').text('');
						var sql = $('#sql-input textarea').val();
						var param = $('#param-input textarea').val();
						if (sql == '' || sql == 'Input SQL Here...') {
							$('#tip span').text('please input sql');
							return;
						}
						if (param == '' || param == 'Input param Here...') {
							choose(sql);
						}else{
							param = param.replace(/\s+/g, "");
							if (param.startsWith('[') && param.endsWith(']')) {
								param = param.substring(1, param.length - 1);
								param = param.replace(/\?/g,
										'-chrome-ahoi-question-');
								var arr = param.split(',');
								var sqlarrlength = sql.match(new RegExp('\\?', 'g')) 
													? sql.match(new RegExp('\\?', 'g')).length : '0';
								if (arr.length != sqlarrlength) {
									$('#tip span').text("'?' in sql do not match to number of param");
									return;
								} else {
									for (var i = 0; i < sqlarrlength; i++) {
										sql = sql.replace("?", "'" + arr[i] + "'");
									}
									$('#result textarea').removeClass();
									sql = sql.replace(/\s+/g, " ");
									sql = sql.replace(/-chrome-ahoi-question-/g,'?');

									choose(sql);
								}
							} else {
								$('#tip span').text("param must be start with '[' and end with ']'");
								return;
							}
						}
					});

	$('#copy button').click(function() {
		$('#result textarea').focus().select();
		document.execCommand('copy');
		$('#result textarea').blur();
		$('#tip span').text('the results have been copied to clipboard');
	});

});

function showPlaceHolder(id, text, className) {
	$('#' + id + ' textarea').val(text);
	$('#' + id + ' textarea').addClass(className);
}

function choose(sql){
	$('#result textarea').height('200');
	if($('#switch').is(':checked')){
		formatter(sql);
	}else{
		result(sql);
	}
}


function formatter(sql) {
	$.ajax({
		async : true,
		type : "post",
		url : "http://www.atool.org/include/SqlFormatter.php",
		dataType : "json",
		data : {
			c : BASE64.encoder(sql),
			o : 1
		},
		beforeSend : function(XMLHttpRequest) {
			$('#loading').show();
			$('#result textarea').val('');
		},
		success : function(data) {
			$('#loading').hide();
			if (data.r == 1) {
				result(data.c);
			} else {
				$('#tip span').text('SQL strint Parse Error, Check Your SQL Style!');
			}
		},
		error : function(data) {
			$('#loading').hide();
			$('#tip span').text('error! please see console.');
			console.log(data);
		}
	});
}

function result(sql){
	if(!sql.endsWith(';')){
		sql += ';';
	}
	$('#result textarea').val(sql);
	$('#result textarea').removeClass('placeholder-max');
	$('#tip span').text('');

	var scrollHeight = $('#result textarea')[0].scrollHeight;
	if (scrollHeight > 450) {
		scrollHeight = 450;
	}
	$('#result textarea').height(scrollHeight);
}
